<template>
  <div class="main">
    <div class="swiper">
      <my-carousel></my-carousel>
    </div>
    <div class="pageHeader">
      <my-page-header></my-page-header>
    </div>
  </div>
</template>

<script>
  import { defineComponent } from 'vue'
  import Carousel from '@/components/Carousel.vue'
  import PageHeader from '@/components/PageHeader.vue'
  export default defineComponent({
    name: 'Main',
    components: {
      MyCarousel: Carousel,
      MyPageHeader: PageHeader,
    }
  });
</script>
<style lang="scss" scoped>
  .main {
    width: 1200px;
    margin: 0 auto;
    padding: 0;
    .swiper {
      margin-top: 10px;
    }
    .pageHeader {
      margin-top: 10px;
    }

  }
</style>
